/*#### FONT IMPORTS ####*/
@import url(https://img.en25.com/Web/itemIndustrietechnikGmbH/%7B0141668e-00c0-4a83-8866-ab9a635d887e%7D_item-webfonts-extended.css);


/*###CTA WITH NEW CI###*/
a, a:link, a:visited, a:hover, a:active, a:focus {
    text-decoration:none;
    color:#fe0009;
}
/*wird gar nicht genutzt?!*/
div.cta, input[type="submit"] {
    margin:0 auto;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-family: "Roboto Condensed", Arial;
    color: #ffffff;
    font-size: 18px;
    line-height: 21px;
    text-decoration: none;
    border: 0 none;
    margin-top: 0px;
    font-weight: 500;
    width: 50%;
    min-width:205px;
    padding: 13px 20px;
    background-color:#fe0009;
    text-transform:uppercase;
}
/*main cta construct*/
span.cta {
    text-decoration: none;
    text-transform: uppercase;
    font-size: 18px;
    font-weight: 300;
    line-height: 26px;
    display: inline-block;
    position: relative;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding: 16px 68px 16px 38px;
    letter-spacing: 0.524px;
    color: #FFFFFF;
    background-color: #0582A8;
    border: 0 none;
    background: -moz-linear-gradient(top, #0582A8 0%, #046785 100%);
    background: -webkit-linear-gradient(top, #0582A8 0%,#046785 100%);
    background: linear-gradient(to bottom, #0582A8 0%,#046785 100%);
    /*
    margin: 0 auto;
    font-family: "Roboto Condensed",Arial;
    margin-top: 0;
    width: auto;
    min-width: 235px;
    text-align: center;
    */
}
span.cta:hover{
    opacity: 0.8;
    text-decoration: none;
}
/*cta after styles*/
span.cta > .cta-text {
    display: inline-block;
    //max-width: 97%;
    //margin-right: 10px;
}
span.cta:after{
    content: "";
    position: absolute;
    top: 0px;
    right: 26px;
    width: 16px;
    height: 100%;
    background: url(http://media.item24.com/Eloqua/Landingpages/global/elq-template-2/img/white-arrow-big.png) no-repeat center right;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
span.cta:after:hover{
    right: 22px;
    text-decoration: none;
}
span.cta > .cta-angle {
    /*
    display: inline-block;
    font-size: 35px;
    position: absolute;
    height: 35px;
    top: 50%;
    margin-top: -19px;
    right: 12px;
    */
}
.cta-angle:before {
    /*
    content: "\f105";
    display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font: normal normal normal 35px/1 FontAwesome;
    */
}
.inner-cta {
    bottom: 20px;
    width: 100%;
    margin: 0 -15px;
    padding:0 15px;
}
.inner-cta.right {
    bottom: 15px;
    text-align:right;
}
/*dirty fix for absoloute buttons*/
.same-height-first > .divider-20,.same-height-second > .divider-20{
    clear: both;
    height: 35px;
}

/*#### RESETS ####*/
body {
    margin:0;
    padding:0px 0px;
    font-family:"Roboto Condensed", Arial;
    font-weight: 300;
}

body div h2, body div p {
    color:#606060;
}
h1, h2, h3, h4, p {
    color:#606060;
}
/*#### TYPO ####*/
p {
    font-family:"Roboto Condensed", Arial;
}
.elq-paragraph {
    font-family: "Roboto Condensed", Arial;
    font-weight: 300;
    font-size:18px;
    line-height:130%;
    margin:10px 0px 18px;
    padding:0;
}
footer {
    background-color:#6b6b6b;
    height:140px;
    vertical-align:middle;
}
.copy {
    float:left;
    font-size:17px;
}

.footer>a, .footer {
    color:white;
    font-size:16px;
    display:inline-block;
    font-weight:500;
}
.footer>a:first-of-type {margin-left:0px !important;}
.footer>a {margin-left:40px;}
.footer.copyright {
    font-size:17px;
}
/*#### LAYOUT ####*/

.logo-border {
    border-bottom:1px solid #dcdcdc;
}
img {
    max-width:100%;
}
.inner {
    background-color:white;

}
.inner > h3 {
    margin-top:0px;
    padding-top:20px;
}
.inner {
    padding-left:15px;
    padding-right:15px;
    position:relative;
}
/*#### ULTILITY ####*/
.desktop-lg {
    display:none;
}
.desktop-sm {
    display:none;
}
.divider-10 {
    height:10px;
    clear:both;
}
.divider-15 {
    height:15px;
    clear:both;
}
.divider-20 {
    height:20px;
    clear:both;
}
.divider-25 {
    height:20px;
    clear:both;
}
.divider-30 {
    height:30px;
    clear:both;
}
.divider-35 {
    height:35px;
    clear:both;
}
.divider-40 {
    height:40px;
    clear:both;
}
.divider {
    height:45px;
    clear:both;
}
.divider-50 {
    height:50px;
    clear:both;
}
.divider-55 {
    height:55px;
    clear:both;
}
.divider-60 {
    height:60px;
    clear:both;
}
.divider-63 {
    height:63px;
    clear:both;
}
.divider-65 {
    height:65px;
    clear:both;
}
.divider-70 {
    height:70px;
    clear:both;
}
.divider-75 {
    height:75px;
    clear:both;
}
.divider-80 {
    height:80px;
    clear:both;
}
.divider-95 {
    height:95px;
    clear:both;
}
.divider-110 {
    height:110px;
    clear:both;
}
.triangle.intro {
    margin-left: auto;
    margin-right: auto;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 25px 25px 0 25px;
    border-color: #fe0009 transparent transparent transparent;
}
.red.intro {
    padding: 14px 80px;
    text-align: center;
}
.gray {
    background-color:rgba(242,242,242,0.7);
}
.pic-left {
    margin-left:0px;
}
.pic-left > div:first-of-type {
    padding-left:0px;
}
.row.flex {
    display:flex;
    flex-wrap:wrap;
}
.row.flex > [class^="col-"].flex {
    float:none;
    display:flex;
    flex-wrap:wrap;
    align-content:flex-start;
}
.claim {
    font-size:18px;
    margin-top:33px;
    color:#606061;
}
.logo {
    padding-top: 20px;
    padding-bottom: 25px;
}
.absolute {
    position:absolute;
}
.intro > h2 {
    padding-top:0px;
}
@media all and (min-width:978px) {
    .form-container.desktop {display:block !important;}
}
@media screen and (min-width:1170px) {
    #kataloge {
        display:block;
    }
    .desktop-lg {
        display:block;
    }
    .desktop-sm {
        display:none;
    }
    .teaser-box {
        background-color: white;
        width: 360px;
        height: 507px;
        padding: 0px;
        margin-left: 15px;
    }
    div.list.text {
        max-width: 87%;
    }
    h1 {
        font-size:26px;
        line-height:120%;
        margin:30px 0px 10px;
        padding:0;
    }
    h2 {
        font-size:28px;
        line-height:120%;
        margin:0px 0px 20px;
        padding:20px 0 0 0;
    }
    .red.intro>h2, .red.intro>h1 {
        font-size: 32px;
        margin: 5px 0;
        line-height: 36px;
        color:#fff !important;
    }
    .red.intro {
        background-color:#fe0009;
    }
    h3 {
        font-size:21px;
        line-height:120%;
        margin:20px 0px 20px;
        padding:0;
        color:#606060;
    }
    p {
        font-family: "Roboto Condensed", Arial;
        font-weight: 300;
        font-size:18px;
        line-height:130%;
        margin:10px 0px 18px;
        padding:0;
    }
}
@media screen and (min-width:992px) {
    #kataloge {
        display:block;
    }
}
@media screen and (min-width:978px) and (max-width:1169px) {
    .red.intro>h2, .red.intro>h1 {
        font-size: 32px;
        margin: 5px 0;
        line-height: 36px;
        color:#fff !important;
    }
    .red.intro {
        background-color:#fe0009;
    }

}
@media screen and (max-width:768px) and (min-width:977px) {
    #kataloge {
        display:block !important;
    }
}
@media screen and (max-width:977px) {
    .red.intro {
        cursor:pointer;
    }
    .overlay .text {
        text-align:center;
    }
    .red.intro>h2, .red.intro>h1 {
        font-size: 32px;
        margin: 5px 0;
        line-height: 36px;
        color:#fff !important;
    }
    .red.intro {
        background-color:#fe0009;
    }
}
@media screen and (min-width:992px) and (max-width:1183px) {
    .desktop-lg {
        display:none;
    }
    .desktop-sm {
        display:block;
    }
}
@media screen and (min-width:992px) and (max-width:1169px) {
    h1 {
        font-size:30px;
        line-height:120%;
        margin:30px 0px 10px;
        padding:0;
    }
    h2 {
        font-size:26px;
        line-height:120%;
        margin:0px 0px 20px;
        padding:20px 0 0 0;
    }
    .red.intro>h2, .red.intro>h1 {
        font-size: 30px;
        margin: 5px 0;
        line-height: 36px;
        color:#fff;
    }
    .red.intro {
        background-color:#fe0009;
    }
    h3 {
        font-size:17px;
        line-height:120%;
        margin:20px 0px 20px;
        padding:0;
    }
    p {
        font-size:17px;
        line-height:130%;
        margin:10px 0px 18px;
        padding:0;
    }
    div.list > .text, .liste_line > li, .liste > li {
        font-size:17px !important;
    }

}
@media screen and (min-width:768px) and (max-width:991px) {
    h1 {
        font-size:30px;
        line-height:120%;
        margin:30px 0px 10px;
        padding:0;
    }
    h2 {
        font-size:26px;
        line-height:120%;
        margin:0px 0px 20px;
        padding:20px 0 0 0;
    }
    .red.intro>h2, .red.intro>h1 {
        font-size: 30px;
        margin: 5px 0;
        line-height: 36px;
        color:#fff;
    }
    .red.intro {
        background-color:#fe0009;
    }
    h3 {
        font-size:17px;
        line-height:120%;
        margin:20px 0px 20px;
        padding:0;
    }
    p {
        font-size:17px;
        line-height:130%;
        margin:10px 0px 18px;
        padding:0;
    }
    div.list > .text, .liste_line > li, .liste > li {
        font-size:17px !important;
    }
}
@media screen and (min-width:641px) and (max-width:767px) {
    h1 {
        font-size:30px;
        line-height:120%;
        margin:30px 0px 10px;
        padding:0;
    }
    h2 {
        font-size:26px;
        line-height:120%;
        margin:0px 0px 20px;
        padding:20px 0 0 0;
    }
    .red.intro>h2, .red.intro>h1 {
        font-size: 30px;
        margin: 5px 0;
        line-height: 36px;
        color:#fff;
    }
    h3 {
        font-size:17px;
        line-height:120%;
        margin:20px 0px 20px;
        padding:0;
    }
    p {
        font-size:17px;
        line-height:130%;
        margin:10px 0px 18px;
        padding:0;
    }
    div.list > .text, .liste_line > li, .liste > li {
        font-size:17px !important;
    }
    .home p, .home h1, .home h2, .home h3 {
        text-align:center !important;
    }
}
@media screen and (max-width:640px) {
    h1 {
        font-size:30px;
        line-height:120%;
        margin:30px 0px 10px;
        padding:0;
    }
    h2 {
        font-size:26px;
        line-height:120%;
        margin:0px 0px 20px;
        padding:20px 0 0 0;
    }
    .red.intro>h2, .red.intro>h1 {
        font-size: 30px;
        margin: 5px 0;
        line-height: 36px;
    }
    h3 {
        font-size:20px;
        line-height:120%;
        margin:20px 0px 20px;
        padding:0;
    }
    p {
        font-size:17px;
        line-height:130%;
        margin:10px 0px 18px;
        padding:0;
    }
    div.list > .text, .liste_line > li, .liste > li {
        font-size:17px !important;
    }
    .home p, .home h1, .home h2, .home h3 {
        text-align:center !important;
    }
}

/*#### GRID SYSTEM ####*/
@media screen and (min-width:1184px) {
    .container {
        width:1170px;
    }
}
@media screen and (min-width:992px) and (max-width:1183px) {
    .container {
        width:960px !important;
    }
}
@media screen and (max-width:992px) {
    .inner-cta {
        position:relative;
        margin:0;
        padding:5px 0 0;
    }
    .inner-cta.right {
        text-align:center !important;
    }
    .inner {
        text-align:center;
    }
    .inner-mobile {
        text-align:center;
    }

    .accordion-arrow{
        position: absolute;
        top: 20%;
        right: 15px;
    }
    .desktop {
        display:none;
    }
    .pic-left>div:first-of-type {
        text-align:center;
    }
    .row>div>.head {
        margin-top:30px;
        text-align:center;
        background-color:white;
    }
    .pic-left {
        margin-left:-15px;
    }
    .pic-left.gray {
        background-color:white;
    }
    .pic-left.gray .inner-mobile, .mobile-head {
        background-color:rgba(242,242,242,0.7);

    }
    .pic-left.gray .inner-mobile {
        padding:0 15px;
    }
    .pic-left > div:first-of-type {
    }
    .pic-left > div {
        padding-left:15px !important;
        padding-right:15px !important;
    }

}